<!DOCTYPE html>
<html lang="en">
<head>
    <!-- 首页 -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/_reset.css">
</head>
<body>
    <div class="whole">
        <!-- 主页头部 -->
        <div class="index_head">
            <img class="log" src="./images/logo.png" alt="">
            <div class="search_box">
                <input type="text" class="search" placeholder="请输入商品名称">
                <img src="./images/搜索矩.png" alt="">
            </div>
            <select class="region">
                <option value="gaungzhou">广州市</option>
            </select>
        </div>
        <main>
            <!-- 轮播 -->
            <div class="rotation_box">
                <img class="strip" src="./images/长条.png" alt="">
            </div>
            <!-- 团购 -->
            <div class="ground_buy">
                <!-- 头部 -->
                <div class="gather_title">
                    <div class="left">
                        <img src="./images/团购.png" alt="">
                        <span>优惠团购</span>
                    </div>
                    <div class="right">
                        <span>更多</span>
                        <img src="./images/更多.png" alt="">
                    </div>
                </div>
                <!-- 图片内容 -->
                <div class="first_line">
                    <img class="img_box" src="./images/麦霸.png" alt="">
                    <img class="img_box" src="./images/红包.png" alt="">
                </div>
                <div class="secend_line">
                    <img class="img_box" src="./images/旅游.png" alt="">
                    <img class="img_box" src="./images/外卖.png" alt="">
                </div>
            </div>
            <!-- 猜我喜欢 -->
            <div class="mylike">
                <!-- 头部 -->
                <div class="gather_title">
                    <div class="left">
                        <img src="./images/爱心.png" alt="">
                        <span>猜你喜欢</span>
                    </div>
                    <div class="right">
                        <span>更多</span>
                        <img src="./images/更多.png" alt="">
                    </div>
                </div>
                <!-- 寿司内容 -->
                <div class="mylike_content">
                    <div class="left">
                        <img src="./images/喜欢1.png" alt="">
                    </div>
                    <div class="right">
                        <div class="content_left">
                            <p class="dish_name">万岁寿司</p>
                            <p class="set_meal">[100店通用]&nbsp;<span>双人套餐</span></p>
                            <p class="price">￥88.00</p>
                        </div>
                        <div class="content_right">
                            <p class="distance">&lt;100m</p>
                            <p class="sale">已售1000</p>
                        </div>
                    </div>
                </div>
                <!-- 周黑鸭内容 -->
                <div class="mylike_content">
                    <div class="left">
                        <img src="./images/喜欢2.png" alt="">
                    </div>
                    <div class="right">
                        <div class="content_left">
                            <p class="dish_name">周黑鸭</p>
                            <p class="set_meal">[100店通用]&nbsp;<span>双人套餐</span></p>
                            <p class="price">￥88.00</p>
                        </div>
                        <div class="content_right">
                            <p class="distance">&lt;100m</p>
                            <p class="sale">已售1000</p>
                        </div>
                    </div>
                </div> 
            </div>
        </main>
        <!-- 尾部 -->
        <footer>
            <div class="navlist">
                <a href="./index.html">
                    <div class="home active">
                        <img src="./images/首页ing.png" alt="">
                    首页
                    </div>
                </a>
                <a href="./classification.html">
                    <div class="classification">
                        <img src="./images/分类.png" alt="">
                        分类
                    </div>
                </a>
                <a href="./find.html">
                    <div class="find">
                        <img src="./images/发现.png" alt="">
                        发现
                    </div>
                </a>
                <a href="./my.html">
                    <div class="my">
                        <img src="./images/我的.png" alt="">
                        我的
                    </div>
                </a>
            </div>
        </footer>
    </div>
</body>
</html>